<template>
  <view class="text-wrapper" v-if="list && list.length > 0">
    <view class="item" v-for="item in list" :key="item.id">
      <v-image :width="'30rpx'" :height="'30rpx'" :url="'/mini/bg/star.png'" />
      <view class="text">{{ item.name }}</view>
    </view>
  </view>
</template>

<script>
import Image from '../../../../components/image/index'

export default {
  props: ['list'],
  components: {
    'v-image': Image,
  },
  data() {
    return {

    }
  },
  methods: {

  },
  created() {

  },
  mounted() {
  },

}
</script>

<style scoped lang="scss">
.text-wrapper {
  margin: 20rpx;
  //background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .item {
    display: flex;
    align-items: center;
    //border: 1rpx solid $main_color;
    border: 1rpx solid rgba(255, 33, 42, 0.5);
    padding: 5rpx 15rpx;
    border-radius: 10rpx;
    .text {
      font-size: 28rpx;
      color: $main_color;
      margin-left: 5rpx;
    }
  }
}
</style>
